<template>
  <div class="app-container" v-loading="loading">
    <p>我的考试安排</p>
    <hr />
    <div v-for="(item) in items" :key="item.id">
      <el-row type="flex" justify="end" >
        <el-col :span=24><h4>{{item.active_name}}</h4>
          <p>准考证号：{{item.code}}</p>
          <p>姓名：{{item.name}}
          <p>考试开始时间：{{item.examStartTime}}</p>
          <p>考场号：{{item.examinationRoomNo}}</p>
          <p>教室：{{item.classroom}}</p>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="24"><span><hr></span></el-col>
      </el-row>
    </div>
    <div style="text-align:center" v-if="items.length > 0">已到底线</div>
    <div style="text-align:center" v-else>暂无考试安排记录</div>
  </div>
</template>

<script>
import { myExamArrangement } from '@/api/examinationArrangement'
import { mapGetters } from 'vuex'
import { parseTime } from '@/utils'
export default {
  name: 'queryActive',
  data() {
    return {
      items: [],
      loading: false
    }
  },
  computed: {
    ...mapGetters([
      'name',
      'roles'
    ])
  },
  mounted: function() {
    const that = this
    that.loading = true
    myExamArrangement(that.name).then(response => {
      if (response.exception) {
        that.processing = false
        that.$message.error(response.exception.message)
        return
      }
      const data = response.result
      for (let i = 0; i < data.length; i++) {
        that.items.push({ id: data[i]['ID'], active_name: data[i]['ACTIVENAME'],
          examStartTime: parseTime(new Date(Date.parse(data[i]['EXAMSTARTTIME'].replace(/-/g, '/')))),
          code: data[i]['CODE'],
          name: data[i]['NAME'],
          examinationRoomNo: data[i]['EXAMINATIONROOMNO'],
          classroom: data[i]['CLASSROOM']
        })
      }
      that.loading = false
    }).catch(error => {
      console.log(error)
      that.loading = false
      that.$message.error('获取数据失败...')
    })
  },
  methods: {

  }
}
</script>

<style scoped>
.tag{
  text-align: center;
  vertical-align: right
}
</style>

